@model SocialGoal.Web.ViewModels.HomeViewModel
@{
    ViewBag.Title = "Home";
    Layout = "../Shared/_HomeLayout.cshtml";
}
<script src="/Scripts/bootstrap-tab.js" type="text/javascript"></script>
<div>
    <div class="span6">
        <div id="notification">
            @Html.Partial("Notification",Model)
        </div>

        @if (Model.Count == 10)
        {
             <div  id="morelink"> <a href="#" onclick="loadMore();">More Notifications</a></div>
        }    
    </div>


    <div class="span6">
        <div class="span12 well" style="height:265px;padding-top:5px;">
           <h4>Goals</h4>
           <ul class="nav nav-tabs" id="GoalTab">
              <li class="active"><a href="#MyGoals">My Goals</a></li>
              <li><a href="#FollowedGoals">Followed Goals</a></li>          
            </ul> 
            <div class="tab-content" style="max-height:220px;overflow-y:auto;">
              <div class="tab-pane active" id="MyGoals">@{ Html.RenderAction("MyGoals", "Goal"); }</div>
              <div class="tab-pane" id="FollowedGoals">@{ Html.RenderAction("GoalsFollowing", "Goal"); }</div>    
            </div>
   
        </div>
        <div class="span12 well" style="margin-left:0px;height:265px;padding-top:5px;">
            <h4>Groups</h4>
            <ul class="nav nav-tabs" id="GroupTab">
              <li class="active"><a href="#MyGroups">My Groups</a></li>
              <li><a href="#FollowedGroups">FollowedGroups</a></li>          
            </ul> 
            <div class="tab-content" style="max-height:220px;overflow-y:auto;">
              <div class="tab-pane active" id="MyGroups">@{ Html.RenderAction("GroupsView", "Group"); }</div>
              <div class="tab-pane" id="FollowedGroups">@{ Html.RenderAction("FollowedGroups", "Group"); }</div>    
            </div>
        </div>
     
    </div>

</div>


<style type="text/css">
    .thumbnail
    {
        width: 50px;
        height: 40px;
    }
</style>


<script type="text/javascript">
   
    $(window).scroll(function () {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            loadMore();
        }
    });
    var current = 0;
    function loadMore() {

        if (current > -1) {
            current++;

            $.ajax({
                url: "/Home/Index",
                type: "POST",
                data: { page: current },
                dataType: "html",
                beforeSend: function () {
                    //<img src="/Images/ajax-loader-small.gif"/>
                    $('.msg').remove();
                    $('#morelink').hide();
                    $("#notification").append('<div class="msg alert alert-info" id="loadimage">Loading...</div>');
                },
                success: function (data) {
                    $('.msg').remove();
                    if (data.length != 0) {
                        $("#notification").append(data);
                        $('#morelink').show();
                        var count = data.match(/class="table"/g);
                        if (count.length < 10)
                        { addNoMoreFeeds(); }
                    }
                    else {
                        addNoMoreFeeds();
                    }
                }
            });

        }
        function addNoMoreFeeds() {
            $('#morelink').hide();
            current = -1;
            $("#notification").append('<div class="msg alert alert-info" id="alertmsg"> No more feeds </div>');

        }
    }

    $('#GroupTab a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });
    $('#GoalTab a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });


   
</script>




